<template>
  <div class="household-div">
    <search-table
      :url="url"
      ref="searchtable"
      :hideSelect="true"
      :columns="columns"
      :defaultParams="defaultParams"
      :headParams="headParams"
      :form="form">
      <!-- 搜索条件 -->
      <template slot="searchForm">
        <a-form layout="inline" :form="form">
          <a-form-item label="账单时间">
            <a-month-picker
              allowClear
              style="width: 150px"
              placeholder="请选择账单时间"
              format="YYYY-MM"
              value-format="YYYY-MM"
              v-decorator="['month']" />
          </a-form-item>
          <!-- <a-form-item label="交易类型">
            <a-select
              showSearch
              allowClear
              style="width: 150px"
              :options="dealTypeList"
              v-decorator="['dealType']"
              placeholder="请选择交易类型">
            </a-select>
          </a-form-item> -->
        </a-form>
      </template>
      <!-- 操作栏 -->
      <template slot="oprationRow">
      <permission authority="">
        <a-button type="primary" @click="exportExcel()">导出</a-button>
      </permission>
      </template>
      <!-- 表格行操作 -->
      <template slot="tableOperation" slot-scope="{ record }">
        <a-space>
          <permission authority="">
            <span class="text-primary pointer" @click="openInfo(record, 'view')">详情</span>
          </permission>
        </a-space>
      </template>
    </search-table>
    <!-- 弹窗 -->
    <householdModal :handle="handle" :record="currentRecord" :visible="infoVisible" @cancel="closeModal"></householdModal>
  </div>
</template>
<script>
import { findDictNameByValue,createOptionsByDict } from '@/utils/dict'
import householdModal from './householdModal';

export default {
  name: 'householdTable',
  props: {
    // 自身的tab
    tab: {
      type: String,
      required: true,
      default: ''
    },
    // 当前活跃的tab
    curTab: {
      type: String,
      required: true,
      default: ''
    },
    // 用户角色类型
    userIdType: {
      type: [String, Number],
      required: true,
      default: ''
    },
  },
  components: {
    householdModal
  },
  data() {
    return {
      url: '', // 列表接口地址
      headParams: {}, // 请求头参数
      defaultParams: { // 默认携带参数
        userIdType: this.userIdType
      },
      currentRecord: {}, // 选中行数据
      infoVisible: false, // 弹窗是否显示
      handle: '', // 操作类型
      dealTypeList: createOptionsByDict('DEAL_TYPE'), // 交易类型集合
      form: this.$form.createForm(this, {
        name: "table_search",
        mapPropsToFields: () => {
          let month = moment().format("YYYY-MM") 
          return {
            month: this.$form.createFormField({
              ...month,
              value: month,
            })
          }
        }
      }), // 搜索表单
      columns: [
        {
          title: "时间",
          dataIndex: "createTime",
          key: "createTime",
        },
        {
          title: "类型",
          dataIndex: "type",
          key: "type",
          customRender: (text, record) => findDictNameByValue('DEAL_TYPE', text)
        },
        {
          title: "交易名称",
          dataIndex: "dealname",
          key: "dealname",
        },
        {
          title: "商品名称",
          dataIndex: "goodsName",
          key: "goodsName",
        },
        {
          title: "订单号",
          dataIndex: "orderId",
          key: "orderId",
        },
        {
          title: "对方账户",
          dataIndex: "otherAccount",
          key: "otherAccount",
        },
        {
          title: "支付方式",
          dataIndex: "payment",
          key: "payment",
        },
        {
          title: "金额",
          dataIndex: "money",
          key: "money",
        },
        {
          title: "操作",
          dataIndex: "operation",
          scopedSlots: { customRender: "operation" },
        },
      ]
    };
  },
  watch: {
    curTab(val) {
      this.checkCurTab()
    },
  },
  created() {},
  mounted() {},
  methods: {
    // 刷新当前tab
    checkCurTab() {
      if(this.curTab == this.tab) {
        this.$nextTick(() => {
          this.$refs.searchtable.refreshTable()
        })
      }
    },
    // 获取总数
    getTotal() {},
    // 打开详情
    openInfo(record, type) {
      this.currentRecord = record
      this.infoVisible = true
      this.handle = type || 'edit'
    },
    // 关闭弹窗
    closeModal(freshTable) {
      this.infoVisible = false
      if (freshTable) {
        this.$refs.searchtable.refreshTable();
      }
    },
    // 导出
    exportExcel() {
      this.$refs.searchtable.getFormValues().then((values) => {
        this.$refs.searchtable.searchParams = {
          ...this.defaultParams,
          ...values
        }

        if(!this.$refs.searchtable.searchParams.month){
          this.$message.warning('请选择导出的时间！');
          return false
        }
        
        this.$refs.searchtable.getList()

        // if (this.$refs.searchtable.dataSource.length == 0) {
        //   this.$message.warning('页面数据为空无法导出！');
        //   return false
        // }

        this.$export('/shop/withdrawal/fee/export', this.$refs.searchtable.searchParams, false)
      })
    }
  }
};
</script>

<style lang="less" scoped></style>
